import { useState } from 'react';
import type { RadioChangeEvent } from 'antd';
import {  Button,Space,Radio,DatePicker,ConfigProvider } from 'antd';
import zhCN from 'antd/es/locale/zh_CN'; 
const { RangePicker } = DatePicker;


const CardRightButton = (props :any)=>{
  const {optionsWithDisabled,changeButton,initButtonValue} = props
  const [value, setValue] = useState(initButtonValue);
  const onChange = ({ target: { value } }: RadioChangeEvent) => {
    setValue(value);
    changeButton(value)
  };
  let deriveButton = <></>
  if(props.derive){
    const {deriveClick} = props
    deriveButton = <Button type="primary" className='edmit' onClick={deriveClick}>导出</Button>
  }
  let pick = <></>
  let chooseTime = null
  if(props.Picker){
    const {ChooseTime} = props
    chooseTime=(val:any,time:any) => {
      ChooseTime({startTime:time[0],endTime:time[1]})
    }
    pick= <ConfigProvider locale={ zhCN }>
    <RangePicker showTime onChange={chooseTime}/>
  </ConfigProvider>
  }
  
  return (
    <>
    <Space>
    {deriveButton}
    <Radio.Group
        options={optionsWithDisabled}
        onChange={onChange}
        value={value}
        optionType="button"
        buttonStyle="solid"
      />
    {pick}
    </Space>
    </>
  )
}

export default CardRightButton